<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>物品交接汇总</title>
    <link rel="stylesheet" href="../../../style/js/layuii/css/layui.css">
    <script src="../../../style/js/layuii/layui.js"></script>
    <script src="../../style/js/jquery-3.2.1.min.js"></script>
    <style>
        #verification {
            width: 170px;
            height: 38px;
            padding-left: 10px;
            border: 0;
            border-bottom: 1px solid #9F9F9F;
        }

        #phone-code-login {
            height: 38px;
            border: 0;
            color: #53cac3;
            border-bottom: 1px solid #9F9F9F;
            background-color: #ffffff;
            cursor: pointer;
            margin-left: 10px;
            margin-top: -38px;
            text-align: right;
        }

        .layui-form-selected dl {
            width: 250px;
        }

        .zly-btn {
            /*color: #60c7d0;*/
            font-size: 12px;
            margin-left: 10px;
        }

        .layui-form-checkbox[lay-skin=primary] span {
            padding-left: 30px;
        }

        /*搜索上方高度*/
        .zly-btn-search {
            margin-top: 0;
        }

        /*输入框左侧字体高度*/
        .layui-form-label {
            padding: 2px 15px;
            width: 100px;
        }

        /*输入框弧度*/
        .layui-input, .layui-select, .layui-textarea {
            border-radius: 0px;
        }

        /*下拉框行高度*/
        .layui-form-select dl dd, .layui-form-select dl dt {
            padding: 0 10px;
            line-height: 24px;
        }

        /*下拉框选中颜色*/
        .layui-form-select dl dd.layui-this {
            background-color: #36c6de;
            color: #fff;
        }

        /*下拉框高度*/
        .layui-form-select dl {
            max-height: 132px;
            width: 60px;
        }

        /*下拉框宽度*/
        .layui-form-select .layui-input {
            padding-right: 30px;
            cursor: pointer;
        }

        /*下拉框字体大小*/
        .layui-text {
            line-height: 24px;
            font-size: 12px;
            color: #666;
        }

        /*复选框颜色*/
        .layui-form-checked span, .layui-form-checked:hover span {
            background-color: #36c6de;
        }

        /*复选框字体大小*/
        .layui-form-checkbox span {
            font-size: 12px;
        }

        /*复选框高度*/
        .layui-form-checkbox {
            height: 24px;
            line-height: 24px;
        }

        /*复选框勾选高度大小*/
        .layui-form-checkbox i {
            height: 22px;
            font-size: 16px;
        }

        /*单选框大小*/
        .layui-form-radio > i {
            margin-right: 8px;
            font-size: 16px;
            color: #c2c2c2;
        }

        /*单选框颜色*/
        .layui-form-radio > i:hover, .layui-form-radioed > i {
            color: #36c6de;
        }

        /*单选框高度*/
        .layui-form-radio {
            line-height: 24px;
            margin: 3px 10px;
        }

        /*按钮大小*/
        .layui-btn {
            height: 24px;
            line-height: 24px;
            background-color: #60c7d0;
            font-size: 12px;
            border-radius: 0px;
        }

        /*时间选择器颜色*/
        .layui-laydate .layui-this {
            background-color: #60c7d0 !important;
            color: #fff !important;
        }


        .xs {
            height: 24px;
            color: #36c6d3;
            cursor: pointer;
        }

        .ly-btn-left {
            color: #fff;
            width: 45%;
            border-radius: 20px 0 0 20px;
            height: 30px;
            line-height: 24px;
            font-size: 12px;
            background-color: #36c6de;
            color: beige;
            border-color: #60c7d0;
            text-indent: 8px;
        }

        .ly-btn-right {
            /*color: #fff;*/
            width: 45%;
            border-radius: 0px 20px 20px 0px;
            height: 30px;
            line-height: 24px;
            font-size: 12px;
            /*background-color: #36c6de;*/
            /*color: beige;*/
            /*border-color: #60c7d0;*/
        }

        /*单选框高度*/
        .layui-form-radio {
            line-height: 24px;
            margin: 3px 10px;
        }

        .layui-form-radio * {
            font-size: 12px;
        }

        .layui-form-checkbox span {
            font-size: 12px;
        }

        .layui-form-label {
            float: left;
            display: block;
            padding: 0px 15px;
            width: 80px;
            font-weight: 400;
            line-height: 24px;
            text-align: right;
            font-size: 12px;
        }

        .layui-input, .layui-select, .layui-textarea {
            height: 24px;
            line-height: 1.3;
            line-height: 30px;
            font-size: 12px;
            border-width: 1px;
            border-style: solid;
            background-color: #fff;
        }

        .layui-form-item .layui-form-checkbox[lay-skin=primary] {
            margin: 6px;
            width: 165px;
        }


        .layui-form-item .layui-input-block .layui-form-checkbox[lay-skin=primary] {
            margin: 6px;
            width: 130px;
        }

        body .layui-table-cell {
            font-size: 12px;
        }

        .layui-laypage .layui-laypage-curr .layui-laypage-em {
            background-color: #60c7d0;
        }

    </style>

</head>
<div style="position:absolute;right:20px;top:5px;z-index: 999">
    <span class="layui-badge-dot">?</span>
    <a href=" " id="sub" onmouseover="show()" onmouseout="onshow()">
        <span style="color: #01C1D1;font-size: 14px">帮助</span>
    </a>
</div>
<div id="caoZuoZhiNan" style="display: none;text-align: center">
    <div>
        <p>1.物品交接汇总页面，能看到所有人提交的物品交接信息</p>
    </div>
</div>
<body style="margin: 30px">
<div class="layui-row">
    <div class="layui-col-md12" style="text-align: center;margin-top: -5px;margin-bottom: 1%;">
        <span id="VouCher" style="font-weight: bold;font-size: 20px;margin-top: -30px">物品交接</span>
    </div>
</div>
<!--主页面搜索-->
<div style="margin-top: 10px;margin-left: 10px;font-size: 12px;">
    <form class="layui-form" action="">
        <div class="layui-row">
            <div class="layui-inline">
                <label class="layui-form-label" style="width: 100px;">交接方式：</label>
                <div class="layui-input-inline">
                    <div class="layui-form-item " style="width: 195px">
                        <select name="modules" lay-search="" id="jiaoJieFangShis">
                            <option value="">请选择交接方式</option>
                            <option value="顺丰快递">顺丰快递</option>
                            <option value="圆通快递">圆通快递</option>
                            <option value="申通快递">申通快递</option>
                            <option value="中通快递">中通快递</option>
                            <option value="韵达快递">韵达快递</option>
                            <option value="UU跑腿">UU跑腿</option>
                            <option value="达达">达达</option>
                            <option value="在本公司">在本公司</option>
                            <option value="在客户公司"> 在客户公司</option>
                            <option value="工商局">工商局</option>
                            <option value="税局">税局</option>
                            <option value="在公司楼下">在公司楼下</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-inline" id="beifenpeizuozhang" style="">
                <label class="layui-form-label" style="width: 100px">填写人：</label>
                <div class="layui-input-inline">
                    <div class="layui-form-item " style="width: 195px">
                        <select name="modules" lay-search="" id="tianXieRen">
                            <option value="">请选择或输入填写人</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="width: 100px;">交接时间：</label>
                <div class="layui-input-inline">
                    <div class="layui-form-item " style="width: 80px">
                        <input type="text" id="jiaoJieShiJianBegin" lay-filter="jiaoJieShiJianBegin"
                               autocomplete="off" placeholder="yyyy-MM-dd" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="width: 17px;margin-left: -15px">~</label>
                <div class="layui-input-inline">
                    <div class="layui-form-item " style="width: 80px;">
                        <input type="text" id="jiaoJieShiJianEnd" lay-filter="jiaoJieShiJianEnd"
                               autocomplete="off" placeholder="yyyy-MM-dd" class="layui-input">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-inline" id="beifenpenzhuguan" style="">
                <label class="layui-form-label" style="width: 100px">给予人：</label>
                <div class="layui-input-inline">
                    <div class="layui-form-item " style="width: 195px">
                        <input type="text" name="title"
                               autocomplete="off" placeholder="请输入给予人名字" id="sendUser" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-inline" id="beifenpeicaiwu" style="">
                <label class="layui-form-label" style="width: 100px">接收人：</label>
                <div class="layui-input-inline">
                    <div class="layui-form-item " style="width: 195px">
                        <input type="text" name="title"
                               autocomplete="off" placeholder="请输入接收人名字" id="acceptUsers" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-inline" style="margin-left: 55px;margin-top: -15px">
                <button type="button" class="layui-btn " id="yemiansousuo" lay-submit style="width: 270px">
                    <i class="layui-icon"></i>搜&nbsp;&nbsp;索
                </button>
            </div>
        </div>
    </form>
</div>


<!--页面表格-->
<div class="layui-row">
    <table id="wuPinJiaoJie_table" lay-filter="wuPinJiaoJie_table"></table>
</div>


<!--查看详情-->
<div id="selectWuPinJiaoJie_div" style="display: none;background-color: #FFFFFF;width: 500px;">
    <!--    回显信息-->
    <form class="layui-form" id="jiaoJieXiangQingForm" style="font-size: 12px;margin-top: 10px">
        <div >
            <div class="layui-form-item" style="padding: 10px 20px;">
                <div class="layui-inline layui-col-lg12" style="margin-bottom: -7px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">交接类型：</label>
                    <label id="jiapjieLeiXing" class="layui-form-label layui-col-lg6"
                           style="width: 200px;text-align: left;transform: translate(-90px, 15px);"></label>
                </div>
                <div class="layui-inline layui-col-lg12" style="margin-bottom: -7px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">公司名称：</label>
                    <label id="GongSiName" class="layui-form-label layui-col-lg6"
                           style="width: 300px;text-align: left;font-weight: 500;transform: translate(-90px, 15px);">暂无</label>
                </div>

                <div class="layui-inline layui-col-lg12" style="margin-bottom: -7px;margin-left: -11px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">给予人：</label>
                    <label id="juyuren" class="layui-form-label layui-col-lg6"
                           style="width: 200px;text-align: left;transform: translate(-78px,15px)"></label>
                </div>

                <div class="layui-inline layui-col-lg12" style="margin-bottom: -7px;margin-left: -11px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">接收人：</label>
                    <label id="jieshouRenName" class="layui-form-label layui-col-lg6"
                           style="width: 200px;text-align: left;transform: translate(-78px,15px)"></label>
                </div>

                <div class="layui-inline layui-col-lg12" style="margin-bottom: -7px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">交接方式：</label>
                    <label id="jiaojiefangshitype" class="layui-form-label layui-col-lg6"
                           style="width: 200px;text-align: left;transform: translate(-89px,15px)"></label>
                </div>

                <div class="layui-inline layui-col-lg12" style="margin-bottom: -7px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">垫付金额：</label>
                    <label id="dianfumoney" class="layui-form-label layui-col-lg6"
                           style="width: 200px;text-align: left;transform: translate(-89px,15px)">暂无</label>
                </div>

                <div class="layui-inline layui-col-lg12" style="margin-bottom: -37px;margin-left: -23px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 50px">备注：</label>
                    <label id="beizhuuser" class="layui-form-label layui-col-lg6"
                           style="width: 400px;text-align: left;transform: translate(55px,-31px)"></label>
                </div>
                <div class="layui-inline layui-col-lg12" style="margin-left: -22px;margin-bottom: -7px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px">用途：</label>
                    <label id="YongTu" class="layui-form-label layui-col-lg6"
                           style="width: 200px;text-align: left;transform: translate(-66px,16px)">暂无</label>
                </div>
                <div class="layui-inline layui-col-lg12" style="margin-bottom: -10px;margin-left: 1px;">
                    <label class="layui-form-label layui-col-lg6" style="text-align: right;color: #8B8878;width: 120px;height: 40px;">交接物品：</label>
                    <label id="tiJiaoWuPin" class="layui-form-label layui-col-lg6"
                           style="width: 400px;text-align: left;transform: translate(26px,-17px)"></label>
                </div>
            </div>
        </div>
    </form>
    <div style="font-size: 12px">
        <div class="layui-row" style="text-align: left;color: #8B8878;width: 120px;height: 40px;margin-left: 66px;margin-top: -40px">图片预览：</div>
        <div class="layui-row" id="jiaoJieTuPian" style="margin: 0 20px 20px 20px;">
        </div>

        <div class="layui-row" style="text-align: left;color: #8B8878;width: 120px;height: 40px;margin-left: 66px;">
            <div class="layui-inline">音频预览：</div>
            <div class="layui-inline" style="color: #000000"><p id="yinPinPreview"></p></div>
        </div>
    </div>
</div>
<!--交接图片轮播-->
<div id="test1" style="margin-top: 20px;">
    <div class="layui-carousel" id="test10" lay-filter="test10">
        <div carousel-item id="lunBo">
        </div>
    </div>
</div>

<!--操作栏-->
<script type="text/html" id="barDemo">
    <a type="button" class="zly-btn" lay-event="detail" style="color: #60c7d0">详情</a>
</script>
</body>

<script>

    layui.use(['table', 'layer', 'jquery', 'form', 'laydate', 'carousel', 'element'], function () {
        let table = layui.table,
            $ = layui.jquery,
            form = layui.form,
            layer = layui.layer,
            laydate = layui.laydate,
            carousel = layui.carousel,
            element = layui.element;

        let date = new Date();
        let dateYear = date.getFullYear();    //获取当期年
        let dateMonth = date.getMonth() + 1;  //获取当前月
        let suoShuYue = null;

        if (dateMonth == 0) {
            dateMonth = 12;
            dateYear = dateYear - 1;
        }
        if (dateMonth < 10) {
            //本月日期
            suoShuYue = dateYear + "-0" + dateMonth;
        } else {
            suoShuYue = dateYear + "-" + dateMonth;
        }

        console.log(suoShuYue)

        laydate.render({
            elem:'#jiaoJieShiJianBegin'
        })
        laydate.render({
            elem:'#jiaoJieShiJianEnd'
        })

        let Year = date.getFullYear();    //获取当期年
        let Month = date.getMonth();  //获取当前月
        let shangYue = null;

        if (Month == 0) {
            Month = 12;
            Year = Year - 1;
        }
        if (Month < 10) {
            //上月
            shangYue = Year + "-0" + Month;
        } else {
            shangYue = Year + "-" + Month;
        }

        console.log(shangYue)

        // 页面下拉框进行回显（填写人）
        $.ajax({
            url: '/wuPinJiaoJie/selectTianXieRen',
            type: 'get',
            dataType: 'json',
            success: function (data) {
                // console.log(data)
                if (data.code == 200) {
                    // console.log(data)
                    for (let i = 0; i < data.data.length; i++) {
                        $("#tianXieRen").append("<option value='" + data.data[i].tianXieUserId + "'>" + data.data[i].tianXieUserName + "</option>");
                    }
                    form.render();
                } else {
                    post_flag = false;
                }

            }
        })


        // 页面下拉框搜索
        $('#yemiansousuo').click(function () {
            let jiaoJieFangShis = $("#jiaoJieFangShis").val();//交接方式
            let jiaoJieTypes = $("#jiaoJieTypes").val();//交接类型
            let sendUser = $("#sendUser").val();//给予人
            let acceptUsers = $("#acceptUsers").val();//接收人
            let tianXieRen = $("#tianXieRen").val();//填写人
            let jiaoJieShiJianBegin = $("#jiaoJieShiJianBegin").val();//填写人
            let jiaoJieShiJianEnd = $("#jiaoJieShiJianEnd").val();//填写人
            console.log("交接方式："+jiaoJieFangShis)
            console.log("交接类型："+jiaoJieTypes)
            console.log("给予人："+sendUser)
            console.log("接收人："+acceptUsers)
            console.log("填写人："+tianXieRen)
            //主页面表格
            table.reload('wuPinJiaoJie_table', {
                url: '/wuPinJiaoJie/selectWuPinJiaoJie'
                ,
                where: {
                    "jiaoJieFangShi": jiaoJieFangShis,
                    "jiaoJieType": jiaoJieTypes,
                    "sendUser": sendUser,
                    "acceptUser": acceptUsers,
                    "tianXieUserId": tianXieRen,
                    "jiaoJieShiJianBegin":jiaoJieShiJianBegin,
                    "jiaoJieShiJianEnd":jiaoJieShiJianEnd
                }
                ,
                page: {curr: 1}
            });
        });



        // 主页面表格
        table.render({
            elem: '#wuPinJiaoJie_table'
            , url: '/wuPinJiaoJie/selectWuPinJiaoJie'
            , defaultToolbar: []
            // ,limits: [10,50,100]
            , cols: [[
                {title: '序号', templet: '#xuhao', type: 'numbers'}
                , {field: 'companyName', title: '公司名称', align: 'left',width:220}
                , {field: 'jiaoJieType', title: '交接类型', align: 'left',style:'font-size:12px',width:160}
                , {field: 'sendUser', title: '物品给予人', align: 'left',style:'font-size:12px',width: 140}
                , {field: 'acceptUser', title: '接收人', align: 'left',style:'font-size:12px',width: 140}
                , {field: 'jiaoJieFangShi', title: '交接方式', align: 'left',style:'font-size:12px',width: 140}
                , {field: 'jiaoJieShiJian', title: '交接时间', align: 'left',style:'font-size:12px',width: 140}
                , {field: 'createTime', title: '提交时间', align: 'left',width: 160, templet: '<div>{{ layui.util.toDateString(d.createTime, "yyyy-MM-dd HH:mm") }}</div>',style:'font-size:12px'}
                , {fixed: 'right', title: '操作', toolbar: '#barDemo',width: 80}
            ]]
            , page: true
        });

        //声明变量存储物品交接ID
        var linkID = "";
        //声明变量存储时间
        var updataTime = "";
        //声明变量存储点击当行信息
        var objdata;

        //建造实例
        carousel.render({
            elem: '#test1'
            , width: '40%' //设置容器宽度
            // ,arrow: 'always' //始终显示箭头
            , anim: 'fade' //切换动画方式
        });

        //监听行工具事件
        table.on('tool(wuPinJiaoJie_table)', function (obj) {
            $("#no").css("display", "none")
            $("#yes").css("display", "none")
            var jiaojiedata = {}
            var data = obj.data;
            if (obj.event === 'detail') {
                var index = layer.open({
                    type: 1,
                    anim: 5,
                    offset: 'r',
                    scrollbar: false,
                    // sink:
                    title: ['详细查询','font-size: 13px'],
                    shade:0.1,
                    shadeClose: true,
                    area: ['510px', '100%'], //宽高
                    content: $('#selectWuPinJiaoJie_div')
                    ,end:function (){
                        $('#selectWuPinJiaoJie_div').css("display","none");
                        $('#jiaoJieXiangQingForm')[0].reset();
                    }
                });
                //给物品交接ID赋值
                linkID = data.wuPinJiaoJieId;
                //查看当前数据的审批状态
                $.ajax({
                    url: "/wuPinJiaoJie/selectShenPiZhuangTai",
                    type: "post",
                    data: {"shenPiId": linkID},
                    dataType: 'json',
                    success: function (data) {
                    }
                })
                $.ajax({
                    url: "/wuPinJiaoJie/selectWuPinJiaoJieXinXi",
                    type: "post",
                    data: {"shenPiId": linkID,"shenPiType":1},
                    dataType: 'json',
                    success: function (data) {
                        console.log(data);
                        //获取选中的公司名字
                        $("#GongSiName").html(data.data.companyName);
                        //获取交接类型
                        $("#jiapjieLeiXing").html(data.data.jiaoJieType);
                        //获取给予人
                        $("#juyuren").html(data.data.sendUser);
                        //获取接收人
                        $("#jieshouRenName").html(data.data.acceptUser);
                        //获取交接方式
                        $("#jiaojiefangshitype").html(data.data.jiaoJieFangShi);
                        //获取备注
                        $("#beizhuuser").html(data.data.beiZhu);
                        //获取到垫付金额
                        $("#dianfumoney").html(data.data.dianFuJinE);
                        //获取提交物品
                        $("#tiJiaoWuPin").html(data.data.jiaoJieWuPin)
                        //获取用途
                        $("#YongTu").html(data.data.yongTu)

                        //将时间戳转化为时间
                        var shijian = new Date(data.data.createTime);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
                        var Y = shijian.getFullYear() + '-';
                        var M = (shijian.getMonth() + 1 < 10 ? '0' + (shijian.getMonth() + 1) : shijian.getMonth() + 1) + '-';
                        var D = (shijian.getDate() < 10 ? '0' + shijian.getDate() : shijian.getDate()) + ' ';
                        var h = (shijian.getHours() < 10 ? '0' + shijian.getHours() : shijian.getHours()) + ':';
                        var m = (shijian.getMinutes() < 10 ? '0' + shijian.getMinutes() : shijian.getMinutes()) + ':';
                        var s = (shijian.getSeconds() < 10 ? '0' + shijian.getSeconds() : shijian.getSeconds());
                        updataTime = Y + M + D + h + m + s

                        // 查询当条数据的提交人
                        var tiJiaoRen;
                        var jiaoJieShiJian;
                        $.ajax({
                            url: "/wuPinJiaoJie/selectTiJiaoRen",
                            type: "post",
                            data: {'wupinjiaojieid': linkID},
                            success: function (yijiandata) {
                                tiJiaoRen = yijiandata.yijiandata.tianXieUserName
                                jiaoJieShiJian = yijiandata.yijiandata.jiaoJieShiJian
                                $("#timeline").html("");
                                $("#timeline").append("<li class=\"layui-timeline-item\">\n" +
                                    "<i class=\"layui-icon layui-timeline-axis\"></i>\n" +
                                    "<div class=\"layui-timeline-content layui-text\">\n" +
                                    "<h3 class=\"layui-timeline-title\" style='font-size: 12px'>" + updataTime + "</h3>\n" +
                                    "<p style='font-size: 12px'>\n" +
                                    yijiandata.yijiandata.tianXieUserName + "添加提交了一条物品交接" + "\n" +
                                    "</p>\n" +
                                    "</div>\n" +
                                    "</li>")
                                $("#tiJiaoRen").html("")
                                $("#tiJiaoRen").append(tiJiaoRen+"提交的物品交接&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;交接时间："+jiaoJieShiJian)
                            }
                        })

                        let html = $("#test1").html()
                        $("#jiaoJieTuPian").append(html)
                        $.ajax({
                            url: "/wuPinJiaoJie/selectfilepath",
                            type: "post",
                            data: {'wupinjiaojieid': linkID},
                            dataType: "json",
                            success: function (res) {
                                console.log(res)
                                $("#lunBo").html("")
                                if (res.code == 200) {
                                    var tuPian = res.data;
                                    console.log(tuPian)
                                    let json = {}
                                    json.title = "交接截图";

                                    for (let i = 0; i < tuPian.length; i++) {
                                        $("#lunBo").append("<div><img layer-src=" + tuPian[i].filePath + "  src=" + tuPian[i].filePath + "  alt='" + tuPian[i].fileName + "'  id='tuPian_" + i + "' style='width: 480px;height: 260px' ></div>")

                                        $("#tuPian_" + i).click(function () {
                                            layer.photos({
                                                photos: "#lunBo",
                                                offset: ['14px'],
                                                anim: 5,//0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
                                            })
                                        })
                                    }
                                } else {
                                    // $("#test1").html("")
                                    $("#lunBo").append("<div style='text-align: center'> 暂无图片 </div>")
                                }
                                //建造实例
                                var ins = carousel.render({
                                    elem: '#test10'
                                    , width: '100%' //设置容器宽度
                                    , arrow: 'hover' //始终显示箭头
                                });
                                //触发轮播切换事件
                                carousel.on('change(test10)', function (obj) { //test1来源于对应HTML容器的 lay-filter="test1" 属性值
                                    console.log(obj.index); //当前条目的索引
                                    console.log(obj.prevIndex); //上一个条目的索引
                                    console.log(obj.item); //当前条目的元素对象
                                });

                                //回显音频下载路径网址
                                $("#yinPinPreview").html("");
                                for (let i = 0; i < res.data.length; i++) {
                                    if (res.data[i].yinPinPath != null) {
                                        $("#yinPinPreview").text(res.data[i].yinPinPath)
                                    } else {
                                        $("#yinPinPreview").text("暂无音频")
                                    }
                                }
                            }
                        })
                    }
                })
            }
        });


    })

    //判断值是否为空
    function isNull(val) {
        if (val == "") return true;
        if (val == undefined) return true;
        let verify = new RegExp("^[ ]+$");
        return verify.test(val);
    }



    // 操作指南
    function show() {
        layui.use('table',function () {
            var $ = layui.$;
            layer.tips($("#caoZuoZhiNan").html(), '#sub', {
                tips: [3, 'gray'],
                area: ['auto', 'auto'],
                left: 100,
                time: 0
            })
        })
    }
    function onshow() {
        layer.closeAll()
    }
</script>
</html>




















